<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>智慧邮局</title>
    <script src="jquery.min.js" type="text/javascript"></script>
    <script src="https://cdn.jsdelivr.net/npm/hls.js@latest"></script>
</head>
<body>
<video id="video" style="width:100%"></video>
</body>
</html>
<script type="text/javascript">
    function getServerPath() {
        return `${window.location.origin}`;
    }
    $(function () {
        var server = getServerPath()+'/huarun';
        $.ajax({
            type: 'get',
            url: server + "/wx/video/getPlayUrl",
            data: {},
            cache: false,
            dataType: 'json',
            timeout: 10000,
            contentType: 'application/json;charset=utf-8',
            success: function (res) {

                var video = document.getElementById('video');
                var videoSrc = res.data.url;
                if (Hls.isSupported()) {
                    var hls = new Hls();
                    hls.loadSource(videoSrc);
                    hls.attachMedia(video);
                }
                else if (video.canPlayType('application/vnd.apple.mpegurl')) {
                    video.src = videoSrc;
                }
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert('网络异常，请刷新页面或稍后再试')
            }
        });
    });
</script>